<!DOCTYPE html>
<html lang="en">


<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <title>产品详情页面</title>

    <!--可选，字体-->
    <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700' rel='stylesheet' type='text/css'>
    <!--Bootstrap Stylesheet [ 必须的 ]-->
    <link href="../../../css/bootstrap.min.css" rel="stylesheet">
    <!--Nifty Stylesheet [ 必须的 ]-->
    <link href="../../../css/nifty.min.css" rel="stylesheet">
    <!--Nifty Premium Icon [ demo用到的icon css ]-->
    <link href="../../../css/demo/nifty-demo-icons.min.css" rel="stylesheet">
    <!--=================================================-->

    <!--Demo [ demo用到的css ]-->
    <link href="../../../css/demo/nifty-demo.min.css" rel="stylesheet">

</head>

<!--TIPS-->
<!--You may remove all ID or Class names which contain "demo-", they are only used for demonstration. -->
<body>
<div id="container" class="effect aside-float aside-bright mainnav-lg">

    <!--NAVBAR-->
    <!--===================================================-->
    <navbar></navbar>
    <!--===================================================-->
    <!--END NAVBAR-->

    <div class="boxed">

        <!--CONTENT CONTAINER-->
        <!--===================================================-->
        <div id="content-container">
            <div id="page-head">
            </div>
            <!--Page content-->
            <!--===================================================-->
            <div id="page-content">

                <div class="panel blog blog-details">
                    <div class="panel-body">
                        <div class="blog-title media-block">
                            <div class="media-right textright">
                                <a href="#" class="btn btn-icon demo-psi-twitter icon-lg add-tooltip"
                                   data-original-title="Twitter" data-container="body"></a>
                                <a href="#" class="btn btn-icon demo-psi-instagram icon-lg add-tooltip"
                                   data-original-title="Instagram" data-container="body"></a>
                            </div>
                            <div class="media-body">
                                <a href="#" class="btn-link">
                                    <h1>博天在线教育系统</h1>
                                </a>
                                <p>By <a href="#" class="btn-link">Alex</a></p>
                            </div>
                        </div>
                        <div class="blog-header">
                            <img class="img-responsive" src="../../../img/shared-img-5.jpg" alt="Image">
                            <small>Photo by: unsplash.com</small>
                        </div>
                        <div class="blog-content">
                            <div class="blog-body">
                                <div class="pad-lft">
                                    <p>产品名称：{{productInfo.name}}</p>
                                    <p>产品代号：{{productInfo.codeName}}</p>
                                    <p>终端类型：
                                        <span v-if="productInfoTerminalIntTypes=='1'">PC 端</span><span v-if="productInfoTerminalIntTypes=='2'">App 端</span><span v-if="productInfoTerminalIntTypes=='3'">其他</span>
                                        <span v-if="productInfoTerminalIntTypes=='1,2'">PC 端,App 端</span><span v-if="productInfoTerminalIntTypes=='2,1'">PC 端,App 端</span><span v-if="productInfoTerminalIntTypes=='1,3'">PC 端,其他</span><span v-if="productInfoTerminalIntTypes=='3,1'">PC 端,其他</span><span v-if="productInfoTerminalIntTypes=='2,3'">App 端,其他</span><span v-if="productInfoTerminalIntTypes=='3,2'">App 端,其他</span>
                                        <span v-if="productInfoTerminalIntTypes=='1,2,3'">PC 端,App 端,其他</span><span v-if="productInfoTerminalIntTypes=='1,3,2'">PC 端,App 端,其他</span><span v-if="productInfoTerminalIntTypes=='2,3,1'">PC 端,App 端,其他</span><span v-if="productInfoTerminalIntTypes=='2,1,3'">PC 端,App 端,其他</span><span v-if="productInfoTerminalIntTypes=='3,2,1'">PC 端,App 端,其他</span><span v-if="productInfoTerminalIntTypes=='3,1,2'">PC 端,App 端,其他</span>
                                    </p>
                                    <p>行业类型：<span v-if="productInfo.dicIndustryId=='1'">教育</span><span v-if="productInfo.dicIndustryId=='2'">金融</span><span v-if="productInfo.dicIndustryId=='3'">医疗</span><span v-if="productInfo.dicIndustryId=='4'">其他</span></p>
                                    <p>产品类型：<span v-if="productInfo.dicProductInfoTypeId=='1'">教育</span><span v-if="productInfo.dicProductInfoTypeId=='2'">金融</span><span v-if="productInfo.dicProductInfoTypeId=='3'">医疗</span><span v-if="productInfo.dicProductInfoTypeId=='4'">其他</span></p>
                                    <p>产品介绍：{{productInfo.des}}</p>
                                </div>
                            </div>
                        </div>
                        <hr>
                        <div class="form-group pull-right">
                            <button type="button" class="btn btn-info" onclick="location='product-info-list.html'">返回</button>
                        </div>
                    </div>
                </div>
                <!--===================================================-->
                <!--End page content-->

            </div>
            <!--===================================================-->
            <!--END CONTENT CONTAINER-->


            <!--MAIN NAVIGATION-->
            <!--===================================================-->
            <mainnav></mainnav>
            <!--===================================================-->
            <!--END MAIN NAVIGATION-->

        </div>


        <!-- FOOTER -->
        <!--===================================================-->
        <footer id="footer">

            <!-- Visible when footer positions are fixed -->
            <!-- ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -->
            <div class="show-fixed pad-rgt pull-right">
                You have <a href="#" class="text-main"><span class="badge badge-danger">3</span> pending action.</a>
            </div>


            <!-- Visible when footer positions are static -->
            <!-- ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -->
            <div class="hide-fixed pull-right pad-rgt">
                14GB of <strong>512GB</strong> Free.
            </div>


            <!-- ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -->
            <!-- Remove the class "show-fixed" and "hide-fixed" to make the content always appears. -->
            <!-- ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ -->

            <p class="pad-lft">&#0169; 2018 Your Company</p>


        </footer>
        <!--===================================================-->
        <!-- END FOOTER -->


        <!-- SCROLL PAGE BUTTON -->
        <!--===================================================-->
        <button class="scroll-top btn">
            <i class="pci-chevron chevron-up"></i>
        </button>
        <!--===================================================-->
    </div>
</div>
<!--===================================================-->
<!-- END OF CONTAINER -->


<!--JAVASCRIPT-->
<!--jQuery [ 必须的 ]-->
<script src="../../../js/jquery.min.js"></script>
<!--BootstrapJS [ 必须的 ]-->
<script src="../../../js/bootstrap.min.js"></script>
<!--NiftyJS [ 必须 ]-->
<script src="../../../js/nifty.min.js"></script>
<!--=================================================-->
<!--Demo script [ demo示例使用 ]-->
<script src="../../../js/demo/nifty-demo.min.js"></script>
<!-- 开发环境版本，包含了有帮助的命令行警告 -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<!--组件导航条-->
<script src="../../../js/component/header.js"></script>
<!--组件导航栏-->
<script src="../../../js/component/mainnav.js"></script>
<!--axios-->
<script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.min.js"></script>


<script>
    var vue = new Vue({
        el: "#container",
        data: {
            productInfoTerminalIntTypes:[],
            productInfo:{
                productInfoTerminalTypes:[]
            }
        },
        methods: {
            detail() {
                let productInfoCode = localStorage.getItem("productInfoCode");
                var str="";
                var productInfoTerminalTypeStr="";
                axios.get("http://127.0.0.1:8080/project/product-info/detail/"+productInfoCode).then(res=>{
                    vue.productInfo=res.data;
                })
                axios.get("http://127.0.0.1:8080/project/product-info/findProductInfoTerminalType/"+productInfoCode).then(res=>{
                    vue.productInfo.productInfoTerminalTypes=res.data;
                    for(productInfoTerminalType of vue.productInfo.productInfoTerminalTypes){
                        productInfoTerminalTypeStr+=","+productInfoTerminalType.type;
                        str=productInfoTerminalTypeStr.substring(1);
                    }
                    vue.productInfoTerminalIntTypes=str;
                    console.log(vue.productInfoTerminalIntTypes);
                })
            }

        },
        created() {
            this.detail();
        }
    })
</script>



</body>
</html>
